.page {
  background-color: rgba(246, 248, 252, 1);
  position: relative;
  width: 100%;
  height: 100vh;
}   

.outer_1 {
  height: 77px;
  background: url('../img/header.png')
    100% no-repeat;
  background-size: 100% 100%;
  justify-content: flex-center;
}

.img_1 {
  width: 135px;
  height: 28px;
  margin: 29px 0 0 40px;
}

.outer_2 {
  width: 1px;
  height: 20px;
  background: url('../img/split.jpg') -1px -2px
    no-repeat;
  background-size: 3px 23px;
  margin: 33px 0 0 14px;
}

.txt_1 {
  width: 96px;
  height: 31px;
  color: rgba(255, 255, 255, 1);
  font-size: 24px;
  font-family: MicrosoftYaHei;
  text-align: left;
  white-space: nowrap;
  line-height: 31px;
  margin: 26px 0 0 16px;
}

.outer_3 {
  width: 40px;
  height: 40px;
  background: url('../img/user.jpg')
    100% no-repeat;
  background-size: 100% 100%;
  margin: 25px 0 0 0;
}

.info_1 {
  height: 24px;
  color: rgba(255, 255, 255, 1);
  font-size: 18px;
  font-family: MicrosoftYaHei;
  text-align: left;
  white-space: nowrap;
  line-height: 24px;
  margin: 32px 0 0 10px;
}

.outer_4 {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  height: 30px;
  width: 56px;
  margin: 29px 40px 0 23px;
}

.word_1 {
  width: 28px;
  height: 19px;
  color: rgba(255, 255, 255, 1);
  font-size: 14px;
  font-family: MicrosoftYaHei;
  text-align: left;
  white-space: nowrap;
  line-height: 19px;
  margin: 6px 0 0 14px;
}

.group_23 {
  height: calc(100% - 110px);
  padding: 20px 30px 0 30px;
  background-color: rgba(246, 248, 252, 1);
}

.footer {
  width: 100%;
  height: 30px;
  line-height: 30px;
  background-color: rgba(246, 248, 252, 1);
  text-align: center;
  font-size: 14px;
  font-family: MicrosoftYaHei;
  color: #959FBE;
}

.tab_1 {
  height: calc(100% - 20px);
  margin: 10px 0 0 0 !important;
  background-color: rgba(255, 255, 255, 1);
}

.box_53 {
  width: 100%;
  padding: 20px 40px;
}

.box_54 button {
  border-radius: 4px !important;
}

.input_1 {
  border-radius: 4px !important;
}

.text_5 {
  width: 56px;
  height: 19px;
  color: rgba(22, 23, 26, 1);
  font-size: 14px;
  font-family: MicrosoftYaHei;
  text-align: left;
  white-space: nowrap;
  line-height: 19px;
  margin-right: 10px;
}

.text_7 {
  width: 28px;
  height: 19px;
  color: rgba(22, 23, 26, 1);
  font-size: 14px;
  font-family: MicrosoftYaHei;
  text-align: left;
  white-space: nowrap;
  line-height: 19px;
  margin: 0 10px;
}

.select_1 {
  height: 36px;
  border-color: #eee !important;
  border-radius: 4px !important;
}

.search_1 {
  margin: 0 10px !important;
  border-radius: 4px !important;
}

.appliedInterface {
  height: 100%;
}

.card_group {
  padding: 10px 40px 0 40px;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  overflow-y: auto;
  height: calc(100% - 78px);
  align-content: flex-start;
}

.card_group::-webkit-scrollbar {
  display: none;
}

.card_1 {
  width: 380px;
  height: 200px;
  background: #FFFFFF;
  box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.0400);
  border-radius: 8px;
  border: 1px solid #F2F4FA;
  margin: 0 20px 20px 0;
}

.card_top {

}

.card_header {
  height: 60px;
}

.card_header_left {
  padding-left: 21px;
}

.card_header_right {
  padding: 10px 10px 0 0;
}

.card_title {
  font-size: 20px;
  font-weight: bold;
  color: #16171A;
  padding-left: 11px;
  height: 31px;
}

.card_content {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  color: #696B70;
  padding: 9px 51px 0 63px;
  margin-bottom: 26px;
  height: 48px;
  display:-webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical; 
  -webkit-line-clamp: 2; /*只显示两行*/
}

.card_bottom {
  border-top: 1px solid #F2F4FA;
  margin: 0 24px;
  height: 55px;
}

.icon_1 {
  width: 2px;
  height: 12px;
  margin: 5px 9px 0 9px;
}

.availableInterface {
  height: 100%;
}
  

.card_group_content {
  height: calc(100% - 78px);
  padding: 10px 40px 0 40px;
  overflow-y: auto;
}

.card_group_content::-webkit-scrollbar {
  display: none;
}

.offlineCode {

}

.offlineCode_header {
  padding-bottom: 19px;
}

.offlineCode_content {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
}

.queryInterface {

}

.queryInterface_header {
  padding-bottom: 19px;
}

.queryInterface_content {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
}
